
<template> 
    <div class="login_con">
      <div class="form_con">
        <div class="login_panel">
          <h2 class='title'>Login Form</h2>
          <p class="info_con">
            <span class="info_icon"><i class="fa fa-user" aria-hidden="true"></i></span>
            <input class="user" v-model="userName" placeholder="User" id='username' />
          </p>
          <p class="info_con">
            <span class="info_icon"><i class="fa fa-lock" aria-hidden="true"></i></span><input class="password"  v-model="pass" placeholder="Password" id='password' type="password" />
          </p>
          <button  id='login' @click="loginFn()" >Login</button>
        </div>
      </div>
      <div class="img_container">
        <p>Power by Accenture Insight Platform</p>
        <div></div>
      </div>
    </div>
</template>

<script>
export default {
  name: 'Login',
  data() {
    return {
      status: true,
      userName:'',
      pass:'',
      service:'',
    }
  },
  
  methods:{
        loginFn:function(){
          this.message = 'Trying to log in ...';
          localStorage.setItem("VUELogin","true");
          this.$router.push({name: 'home'});
          
        },
        
  },
  created: function() {
   
    
  },
  destroyed: function() {},
  
}
</script>
<style scoped src="./style.scss"></style>
